how to override ckeditor events [migrated]

Posted by joe on Pro Webmasters See other posts from Pro Webmasters or by joe
Published on 2014-05-30T15:09:44Z Indexed on 2014/05/30 16:03 UTC
Read the original article Hit count: 196

Filed under:
|
|

I am new to ckeditor, I have hard time figuring this issue out. due to my html design; if I try to use the link editor dialog while my ckeditor is maximized, it just doesn't show up, I understand that ckeditor is the top most object in my html page and the link dialog comes underneath it. if now I bring ckeditor to its normal state I will be able to see and use the link dialog.

my idea is to slightly override the link button click event as follows:

if the editor is in full screen mode, bring it back to the normal state. and keep a flag somewhere so that when I close the link dialog, I can decide whether to bring back the ckeditor to a maximized mode again. now this is easy logic except that I do not know how to override the click event of the link button and keep it work as expected.

here's what I have:

$().ready(function () {
var editor = $('#txa').ckeditor();
CKEDITOR.plugins.registered['link']=
{
 init : function( editor )
 {
    var command = editor.addCommand( 'link',
       {
          modes : { wysiwyg:1, source:1 },
          exec : function( editor ) {
              if(editor.commands.maximize.state == 1 ){
                 alert("maximized");
                      //....here bring back the editor to UN-maximized state and let the link button event click do the default behavior 
              }
              else
              {
                  alert("normal state");
              }
              //2 is normal state
              //1 is maximized

          }

       }
    );
    editor.ui.addButton( 'link',{label : 'YOUR LABEL',command : 'link'});
 }
}


});

html part to make the exemple work:

<div>
<textarea id="txa">
</textarea> 
</div>

TO BE SHORT:

http://jsfiddle.net/Q43QP/

if the editor is maximized, bring it to normal state then show the link dialog.

© Pro Webmasters or respective owner

Related posts about html

Related posts about jQuery